<template>
  <div id="zyfl-container">
    <div class="top">
      <div class="addBtn">
        <el-button size="mini" type="primary" @click="handleReturn">返回</el-button>
      </div>
    </div>
    <ul class="dataList">
      <li>
        <div class="title tl">
          <i class="el-icon-share" style="cursor: default;" />
          {{ zyflInfoInfo.catalogName }}
        </div>
        <div class="info">
          <div>信息资源分类：{{ zyflInfoInfo.dataNodes.map(row => row.name).join('，') }}</div>
          <div class="infoFlex">
            <div class="infoItem">
              <div>信息资源提供方：{{ (zyflInfoInfo.dataSource && zyflInfoInfo.dataSource.name) || '-' }}</div>
              <div>共享类型：{{ zyflInfoInfo.sharedType === 0 ? '无条件共享' : zyflInfoInfo.sharedType === 1 ? '有条件共享' : zyflInfoInfo.sharedType === 2 ? '不子共享' : '未知共享条件' }}</div>
            </div>
            <div class="infoItem">
              <div>创建时间：{{ zyflInfoInfo.createTime }}</div>
              <div class="ellipsis" :title="zyflInfoInfo.sharedCondition">共享条件：{{ zyflInfoInfo.sharedCondition || '无' }}</div>
            </div>
            <div class="infoItem">
              <!-- <div>更新周期：{{ zyflInfoInfo.frequency }}</div> -->
              <div>更新周期：{{ formatUpdateCycle(zyflInfoInfo.updateCycle) }}</div>
            </div>
            <div class="infoItem">
              <div>资源类型： 数据资源</div>
              <div>共享方式：{{ (zyflInfoInfo.sharedWay || []).map(row => row.sharedName).join(', ') }}</div>
            </div>
          </div>
        </div>
      </li>
    </ul>
    <div class="infoTabs">
      <el-tabs v-model="actName">
        <el-table
          :data="xxxmc"
          border
          style="width: 100%"
          empty-text="暂无信息项数据"
          highlight-current-row
        >
          <el-table-column prop="itemName" label="数据项名称" />
          <el-table-column prop="itemEnglishName" label="数据项英文名" />
          <el-table-column prop="dataTypeLabel" label="数据类型" />
          <el-table-column prop="dataLength" label="数据长度" />
          <el-table-column prop="isDictLabel" label="是否有字典项" />
          <!-- <el-table-column prop="sharedTypeLabel" label="共享类型" /> -->
          <el-table-column prop="isRequiredLabel" label="是否必填" />
        </el-table>
      </el-tabs>
    </div>
  </div>
</template>

<script>
export default {
  name: 'SjzyZyflInfo',
  props: {
    zyflInfoInfo: {
      type: Object, // 根据实际类型修改，可能是Object/Array/String等
      required: false, // 或true
      default: () => {} // 可选，设置默认值
    }
  },
  data() {
    return {
      actName: 'xxx',
      xxxmc: [],
      dictMap: {
        dataType: {
          '0': '字符串型',
          '1': '数值型N',
          '2': '货币型Y',
          '3': '日期型D',
          '4': '日期时间型T',
          '5': '逻辑型L',
          '6': '备注型M',
          '7': '通用型G',
          '8': '双精度型B',
          '9': '整型I',
          '10': '浮点型F',
          '11': '二进制blob',
          '12': '长文本text'
        },
        isDict: { '0': '是', '1': '否' },
        sharedType: { '0': '无条件共享', '1': '有条件共享', '2': '不予共享' },
        isRequired: { '0': '是', '1': '否' }
      }
    }
  },
  watch: {
    zyflInfoInfo: {
      immediate: true, // 初始化时立即执行
      handler(newVal) {
        if (newVal) {
          // 处理数据，添加文本标签
          this.xxxmc = newVal.catalogItems.map(item => ({
            ...item,
            dataTypeLabel: this.dictMap.dataType[item.dataType] || '未知',
            isDictLabel: this.dictMap.isDict[item.isDict] || '未知',
            sharedTypeLabel: this.dictMap.sharedType[item.sharedType] || '未知',
            isRequiredLabel: this.dictMap.isRequired[item.isRequired] || '未知'
          }))
        }
      }
    }
  },
  methods: {
    handleReturn() {
      this.$emit('zyflInfoClose')
    },
    formatUpdateCycle(val) {
      const sharedTypeMap = { 0: '无条件共享', 1: '有条件共享', 2: '不予共享' }
      const cycleMap = { 0: '实时', 1: '每天', 2: '每周', 3: '每月', 4: '每季度', 5: '每半年', 6: '每年', 7: '其他' }
      // 区分共享类型和更新周期（避免格式混淆）
      return sharedTypeMap[val] || cycleMap[val] || '未知'
    }
  }
}
</script>

<style scoped src="@/assets/css/zyfl.css"></style>
<style>

.tl{
  text-align: left;
}

</style>
